// pages/poster-img/index.js
import { base64src } from '../../utils/data-handler-utils'
Page({

  /**
   * 页面的初始数据
   */
  data: {
    posterConfig: {  
      width: 750,
      height: 1222
    },
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    wx.showShareMenu({
      withShareTicket: true,
      menus: ["shareAppMessage", "shareTimeline"]
    });

  },

  
  /**
   * 海报生成成功
   * @param {*} e 
   */
  onPosterSuccess(e){
    const { detail } = e;
    wx.showShareImageMenu({
      path: detail,
      success: () => {
        console.log('分享成功回调');
        this.setData({
          isShowInviteToast: true
        })
      },
      fail: err => {
        console.log('分享失败回调');
        console.log(err);
      }
    })
   // wx.previewImage({ current: detail, urls: [detail] })
  },
  /**
   * 海报生成失败
   * @param {*} e 
   */
  onPosterFail(e){
    console.log(e,'e')
    wx.showToast({
      title: '分享失败',
      icon: 'none',
      duration: 3000
    })
  },
  /**
   * 生成海报
   * @param {*} codeImg 
   */
  onCreatePoster(codeImg) { 
    base64src(codeImg, (imgUrl) => {
      console.log(imgUrl); //二维码图片
      // 用户注册账号后未完善信息使用的默认头像
      if (this.data.avatarUrl.startsWith('data:image/png;base64,')) {
        base64src(this.data.avatarUrl, tempFilePath => { //将base64图片转为临时文件
          this.setPosterConfig(imgUrl, {tempFilePath})
        })
        return
      }
      // 用户注册账号后完善了信息使用的链接地址
      wx.downloadFile({
        url:this.data.avatarUrl,
        success: res => {
          if (res.statusCode === 200) {
            this.setPosterConfig(imgUrl, res)
          }
        }, fail: res => {
          console.log(res);
        }
      });
    })
  },

  /**
   * 设置配置
   * @param {*} imgUrl 二维码临时地址
   * @param {*} res 头像转成本地临时地址
   */
  setPosterConfig(imgUrl, res){
    let posterConfig={
      width: 750,
      height: 1406,
      backgroundColor: 'rgba(255, 255, 255, 1)',
      borderRadius:0,
      debug: false,
      pixelRatio: 1,
      texts: [
        {
            x:68,
            y: 382,
            text: '【'+this.data.nickName+'】',
            fontSize: 32,
            fontWeight: '500',
            color: '#C5AF6F',
            lineHeight:44,
            fontFamily: "PingFangSC-Medium, PingFang SC"
        },
        {
            x:80,
            y: 442,
            text: '邀请你加入测肤精灵',
            fontSize: 28,
            fontWeight: '500',
            color: '#C5AF6F',
            lineHeight:40,
            fontFamily: "PingFangSC-Medium, PingFang SC"
        },
        {
          x:80,
          y: 498,
          text: 'AI智能测肤，专属定制护肤方案，快来体验',
          fontSize: 22,
          fontWeight: '400',
          color: 'rgba(197,175,111,0.75)',
          lineHeight:32,
          fontFamily: "PingFangSC-Medium, PingFang SC"
        },
        // {
        //   x:256,
        //   y: 1070,
        //   text: '扫码体验，立送200积分',
        //   fontSize: 22,
        //   fontWeight: '400',
        //   color: '#777777',
        //   lineHeight:32,
        //   fontFamily: "PingFangSC-Medium, PingFang SC"
        // },
        // {
        //   x:276,
        //   y: 1115,
        //   text: '积分可兑换护肤产品',
        //   fontSize: 22,
        //   fontWeight: '400',
        //   color: '#777777',
        //   lineHeight:32,
        //   fontFamily: "PingFangSC-Medium, PingFang SC"
        // },
        {
          x:102,
          y:1282,
          text: '①  保存图片到相册',
          fontSize: 28,
          fontWeight: '400',
          color: '#999999',
          lineHeight:40,
          fontFamily: "PingFangSC-Medium, PingFang SC"
        },
        {
          x:102,
          y:1346,
          text: '②  在微信长按识别二维码',
          fontSize: 28,
          fontWeight: '400',
          color: '#999999',
          lineHeight:40,
          fontFamily: "PingFangSC-Medium, PingFang SC"
        }
      ],
      images: [
        {
          width:622,
          height:104,
          url:'/assets/common/SKIN-ELF.png',
          x:64,
          y:0
        },
        {
          width:234,
          height:58,
          url:'/assets/common/skin-text.png',
          x:82,
          y:234
        },
        {
          width:308,
          height:308,
          url:imgUrl,
          x:222,
          y:646
        },
        {
          width:408,
          height:392,
          url:"/assets/common/qrcode-border.png",
          x:172,
          y:604
        },
        {
          width:128,
          height:128,
          url:res.tempFilePath,
          x:524,
          y:274,
          borderRadius:128
        }
      ],
      lines: [
        {
          startX:80,
          startY:329,
          endX:520,
          endY:329,
          color: "rgba(0, 0, 0, 0.15)",
          width:2
        }
      ],
      blocks:[
        {
          x:32,
          y:160,
          width:686,
          height:1006,
          backgroundColor:"rgba(255, 255, 255, 1)",
          borderRadius: "48",
          zIndex:-1
        },{
          x:502,
          y:252,
          width:172,
          height:172,
          backgroundColor:"rgba(250, 234, 188, 1)",
          borderRadius: "172"
        },
        {
          x:0,
          y:0,
          width:750,
          height:1222,
          backgroundColor:"rgba(255, 248, 231, 1)",
          zIndex:-2
        }
      ]
    }
    this.setData({ posterConfig: posterConfig })
  },
  /**
   * 关闭分享成功
   */
  closeInviteToast(){
    this.setData({
      isShowInviteToast: false
    })
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  },

  /**
   * 分享至朋友圈
   */
  onShareTimeline(){
    return {
      title: '精彩的小程序页面',
      // imageUrl: 'https://example.com/image.jpg',
      query: 'page=detail'
    }
  },
  shareToTimeline: function() {
    wx.showShareMenu({
      withShareTicket: true,
      menus: ["shareAppMessage", "shareTimeline"]
    });

    // wx.onShareTimeline({
    //   title: '精彩的小程序页面',
    //   imageUrl: 'https://example.com/image.jpg',
    //   query: 'page=detail'
    // });
  }
})